buiquangduc /
WP_Default_Feature_Image
| Conditions | 1 |
| Paths | 1 |
| Total Lines | 94 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 0 | ||
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | var ImageUpload = function(className) { |
||
| 2 | |||
| 3 | /** |
||
| 4 | * imageUpload variable is created to represent ImageUpload instance. |
||
| 5 | */ |
||
| 6 | var imageUpload = this; |
||
| 7 | |||
| 8 | /** |
||
| 9 | * element variable is created to represent master element of the ImageUpload. |
||
| 10 | */ |
||
| 11 | var element = $(className); |
||
| 12 | |||
| 13 | /** |
||
| 14 | * wrapperImage variable is created to represent image wrapper div of the ImageUpload. |
||
| 15 | */ |
||
| 16 | var wrapperImage = element.find('.wrapper-image'); |
||
| 17 | |||
| 18 | /** |
||
| 19 | * uploadButton variable is created to represent upload button of the ImageUpload. |
||
| 20 | */ |
||
| 21 | var uploadButton = element.find('.upload-btn'); |
||
| 22 | |||
| 23 | /** |
||
| 24 | * image variable is created to represent image uploaded of the ImageUpload. |
||
| 25 | */ |
||
| 26 | var image = element.find('.image'); |
||
| 27 | |||
| 28 | /** |
||
| 29 | * imageInputId variable is created to represent image input id field of the ImageUpload. |
||
| 30 | */ |
||
| 31 | var imageInputId = element.find('.image-input-id'); |
||
| 32 | |||
| 33 | /** |
||
| 34 | * imageInputSource variable is created to represent image input source field of the ImageUpload. |
||
| 35 | */ |
||
| 36 | var imageInputSource = element.find('.image-input-source'); |
||
| 37 | |||
| 38 | /** |
||
| 39 | * Initialize actions. |
||
| 40 | */ |
||
| 41 | this.init = function() { |
||
| 42 | /* Popup Default WordPress build in system to import or select image. */ |
||
| 43 | imageUpload._popupMedia(); |
||
| 44 | } |
||
| 45 | |||
| 46 | /** |
||
| 47 | * Popup Default WordPress build in system to import or select image. |
||
| 48 | * global: wp |
||
| 49 | */ |
||
| 50 | this._popupMedia = function() { |
||
| 51 | uploadButton.click(function(e) { |
||
| 52 | e.preventDefault(); |
||
| 53 | var _image = wp.media({ |
||
| 54 | title: 'Upload Image', |
||
| 55 | // mutiple: true if you want to upload multiple files at once. |
||
| 56 | multiple: false |
||
| 57 | }).open().on('select', function(){ |
||
| 58 | // This will return the selected image from the Media Uploader, the result is an object. |
||
| 59 | var _uploaded_image = _image.state().get('selection').first(); |
||
| 60 | // We convert uploaded_image to a JSON object to make accessing it easier. |
||
| 61 | var _image_url = _uploaded_image.toJSON().url; |
||
| 62 | // Display the image, save the value to the input id and input source. |
||
| 63 | wrapperImage.css('display', 'block'); |
||
| 64 | image.attr('src', _image_url); |
||
| 65 | imageInputSource.val(_image_url); |
||
| 66 | imageInputId.val(_uploaded_image.id); |
||
| 67 | }); |
||
| 68 | }); |
||
| 69 | } |
||
| 70 | |||
| 71 | /** |
||
| 72 | * Return the ID of uploaded image |
||
| 73 | */ |
||
| 74 | this.getId = function() { |
||
| 75 | return imageInputId.val(); |
||
| 76 | } |
||
| 77 | |||
| 78 | /** |
||
| 79 | * Return the image source of uploaded image |
||
| 80 | */ |
||
| 81 | this.getSource = function() { |
||
| 82 | return imageInputSource.val(); |
||
| 83 | } |
||
| 84 | |||
| 85 | /** |
||
| 86 | * Delete the ImageUpload. |
||
| 87 | */ |
||
| 88 | this.delete = function() { |
||
| 89 | /* Remove the image upload element. */ |
||
| 90 | element.remove(); |
||
| 91 | } |
||
| 92 | |||
| 93 | imageUpload.init(); |
||
| 94 | } |
||
| 95 | |||
| 97 |
